<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>树</title>
    [#include "../../../include/header.ftl" /]
    <link href="${ctx}/static/apls/assets/plugins/bootsrap-treeview/bootstrap-treeview.min.css">
    <script type="text/javascript"
            src="${ctx}/static/apls/assets/plugins/bootsrap-treeview/bootstrap-treeview.min.js"></script>

</head>
<body>
<div id="tree"></div>
</body>
<script type="text/javascript">
    $(function () {
        $('#tree').treeview({
            data: [
                {
                    text: "Node 1",
                    icon: "glyphicon glyphicon-stop",
                    selectedIcon: "glyphicon glyphicon-stop",
                    color: "#000000",
                    backColor: "#FFFFFF",
                    href: "#node-1",
                    selectable: true,
                    state: {
                        checked: true,
                        disabled: false,
                        expanded: true,
                        selected: true
                    },
                    tags: ['available'],
                    nodes: [
                        {
                            text: "Child 1",
                            nodes: [
                                {
                                    text: "Grandchild 1",
                                    nodes: [
                                        {
                                            text: "Grandchild 3",
                                            nodes: [
                                                {
                                                    text: "Grandchild 5",
                                                    nodes: [
                                                        {
                                                            text: "Grandchild 7",
                                                            nodes: [
                                                                {
                                                                    text: "Grandchild 9"
                                                                },
                                                                {
                                                                    text: "Grandchild 10"
                                                                }
                                                            ]
                                                        },
                                                        {
                                                            text: "Grandchild 7"
                                                        }
                                                    ]
                                                },
                                                {
                                                    text: "Grandchild 6"
                                                }
                                            ]
                                        },
                                        {
                                            text: "Grandchild 4"
                                        }
                                    ]
                                },
                                {
                                    text: "Grandchild 2"
                                }
                            ]
                        },
                        {
                            text: "Child 2"
                        }
                    ]
                },
                {
                    text: "Parent 2"
                },
                {
                    text: "Parent 3"
                },
                {
                    text: "Parent 4"
                },
                {
                    text: "Parent 5"
                }
            ]
        });
    })


</script>
</html>